<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>节点包裹</title>
</head>
<body>
	<h1>JQuery节点包裹</h1>
	<input type="button" value="用p标签包住每一个input" onclick="wrap()" />
	<input type="button" value="用p标签包住所有的input" onclick="wrapA()" />
	<input type="button" value="li中的文字加粗" onclick="cu()" />
	<input type="button" value="li中的文字斜体" onclick="xie()" />
	<input type="button" value="li中的字体下划线" onclick="xian()"
	<input type="text" name="" id="" />
	<input type="text" name="" id="" />
	<input type="text" name="" id="" />
	<ul>
		<li>春</li>
		<li>夏</li>
		<li>秋</li>
		<li>冬</li>
	</ul>
</body>
<script type="text/javascript" src="jquery-3.1.1.js"></script>
	<script type="text/javascript">
	    //用p标签包住每一个input:text
		function wrap(){
			$('input:text').wrap('<p></p>');
		}
		//用一个p标签包住所有input:text
		function wrapA(){
			$('input:text').wrapAll('<p></p>');
		}
		//为li标签里的内容添加加粗标签
		function cu(){
			$('li').wrapInner('<b></b>');
		}
		//为li标签里的内容添加斜体标签
		function xie(){
			$('li').wrapInner('<i></i>');
		}
		//为li标签里的内容添加下划线标签
		function xian(){
			$('li').wrapInner('<u></u>')
		}
	</script>
</html>